<ui:composition xmlns="http://www.w3.org/1999/xhtml" xmlns:ui="http://java.sun.com/jsf/facelets"
  xmlns:f="http://java.sun.com/jsf/core" xmlns:p="http://primefaces.org/ui" xmlns:h="http://java.sun.com/jsf/html"
  xmlns:pr="http://java.sun.com/jsf/composite/totororo">
 
<script>
function handleDrop(event, ui) {
	$(event.target).find("p").html("En cours d'ajout...");
	$('.loader img').css('display', 'block');
	setTimeout(function () {
		$(event.target).find("p").html("Glissez les livres ici!");
		$('.loader img').css('display', 'none');
    }, 3500);
}
</script>
 					
	<pr:localeChooser/>
	<h:panelGroup layout="block" class="login-click" rendered="#{clientController.loggedIn != true}">    	
	    <pr:popup type="login" link="true" popup="true"/>	
	    <h:outputText value=" ou "/>
	    <pr:popup type="register" link="true" popup="true" />
  	</h:panelGroup>
	<h:form id="login-header">
		<h:panelGroup rendered="#{clientController.loggedIn}">
		<h:panelGroup styleClass="avatar">
			<pr:photo type="client" elementId="#{currentClient.id}" size="avatar"/>
		</h:panelGroup>
		<div class="clearer"></div>	
		<h:panelGroup styleClass="nom-avatar"><h:outputText value="#{currentClient.login}" /></h:panelGroup>
		<div class="clearer"></div>
			<h:commandLink action="#{clientController.doLogout}" value="#{strings['home.logout']}" />
			<p:spacer width="5" height="0" />
			<h:link value="#{strings['home.profile']}" outcome="affichageProfil" />
		</h:panelGroup>
	</h:form>
  
  	<h:form>
	  	<h:commandLink outcome="home">
			<a href="#{facesContext.externalContext.requestContextPath}/faces/front/index.xhtml">
				<img src="#{facesContext.externalContext.requestContextPath}/resources/images/bookstore-logo.jpg" />
			</a>
		</h:commandLink>
	</h:form>
 	
	<h:form>
	<ul class="menu home categories">
		<li><h:link outcome="contact" value="#{strings['home.contact']}" rendered="#{clientController.loggedIn}"/></li>
		<li><h:link outcome="localisation" value="#{strings['home.localisation']}" rendered="#{clientController.loggedIn}"/></li>
		<li><h:link outcome="clientOrders" value="#{strings['home.order']}" rendered="#{clientController.loggedIn}"/></li>
		<li class="menu-categories">
			<h:outputText value="#{strings['home.categories']}" />
			 <ul class="sub-menu">
				 <ui:repeat var="c" value="#{menuController.categories}" >
					<li>
						<h:link value="#{c.title}" outcome="produitCategorie">
					      <f:param name="categoryId" value="#{c.id}"/>
					    </h:link>						
					</li>
			    </ui:repeat>
			</ul>
	    </li>
	</ul>
	</h:form>
	<div class="clearer"></div>

	<ui:param name="display_cart" value='#{(cartController.order.size != 0)}' />
<ui:param name="is_cart_page" value='#{(facesContext.viewRoot.viewId == "/front/cart/index.xhtml")}' />
 	
<ui:include src="cart.xhtml"></ui:include>
      	
<div class="clearer"></div>
<p:outputLabel styleClass="autocomplete-home">
<h:form styleClass="recherche-input">
	<p:autoComplete id="acSimple" value="#{homeController.recherche}" completeMethod="#{homeController.complete}"/>
	<p:commandButton action="#{homeController.execRecherche}" value="#{strings['home.rechercher']}" ajax="false"/>
</h:form>
</p:outputLabel>
</ui:composition>